<%@ page language="java" contentType="text/html; charset=UTF-8"
         pageEncoding="UTF-8" %>
<!doctype html>
<html>
<head>
    <%@ include file="/common/common.jsp" %>
    <title>员工管理</title>
    <link rel="stylesheet" type="text/css" href="../statics/aui/css/aui.css"/>
    <link rel="stylesheet" type="text/css" href="${ctx }/css/weui.min.css"/>

    <style type="text/css">
        .receivables_text {
            font-family: PingFangSC-Regular;
            font-size: 15px;
            color: #666666;
            line-height: 30px;
            text-align: right;
        }
    </style>
</head>
<body>
<section class="aui-content">

    <ul class="aui-list">
        <table width="100%">
            <c:forEach items="${requestScope.cashierslist}" var="cashiers">
                <tr>
                    <td>
                        <li class="aui-list-item " >
                            <div class="aui-list-item-inner">
                                <div class="aui-list-item-title receivables_text <c:if test="${cashiers.role==2}">cashiersDiv</c:if>" codeName="${cashiers.name}" mobilephone="${cashiers.mobilephone}">
                                        ${cashiers.name}<label style="font-size: 0.6rem;color: #757575;">(${cashiers.inviteCode})</label>
                                    <c:if test="${cashiers.activateState==0}">
                                        <img alt="" src="../statics/aui/images/djh.png">
                                    </c:if>
                                    <c:if test="${cashiers.activateState==1}">
                                        <img alt="" src="../statics/aui/images/yjh.png">
                                    </c:if>
                                    <c:if test="${cashiers.activateState==2}">
                                        <img alt="" src="../statics/aui/images/ysc.png">
                                    </c:if>
                                </div>
                                 <div class="aui-list-item-right <c:if test="${cashiers.role==2}">cashiersDiv</c:if>" codeName="${cashiers.name}" mobilephone="${cashiers.mobilephone}">${cashiers.shopname}</div>
                                 <div class="aui-list-item-right">${cashiers.mobilephone}</div>
                            </div>
                        </li>
                    </td>
                </tr>
            </c:forEach>
        </table>
    </ul>
</section>
<section class="aui-content"
         style="margin-top: 44px; padding-left: 20px; padding-right: 20px;">
    <p>
    <div class="aui-btn aui-btn-info  aui-btn-block" onclick="location='cashierPage'">添加收款员</div>
    <br/>
    </p>
</section>


<!------弹层处理------><!------弹层处理------>
<div>
    <div class="weui-mask" id="iosNdMask" style="display: none"></div>
    <div class="weui-actionsheet" id="iosNdActionsheet">
        <div class="weui-actionsheet__title">
            <input type="hidden" id="codeNameNd">
            <input type="hidden" id="mobilephoneNd">
            <p class="weui-actionsheet__title-text">选择操作</p>
        </div>
        <div class="weui-actionsheet__menu">
            <div class="weui-actionsheet__cell colorDanger">删除</div>
        </div>
        <div class="weui-actionsheet__action">
            <div class="weui-actionsheet__cell" id="iosNdActionsheetCancel">取消</div>
        </div>
    </div>
</div>
<div id="dialogs">
    <div class="js_dialog" id="iosDialog1" style="display: none;">
        <div class="weui-mask">
            <input type="hidden" id="mobilephone">
        </div>
        <div class="weui-dialog">
            <div class="weui-dialog__hd"><strong class="weui-dialog__title">确认要删除？</strong></div>
            <div class="weui-dialog__bd">确定要删除 <label id="codeNameVal"></label> 的收款二维码吗？</div>
            <div class="weui-dialog__ft">
                <a href="javascript:;" class="weui-dialog__btn weui-dialog__btn_default DeleteDefault">取消</a>
                <a href="javascript:;" class="weui-dialog__btn weui-dialog__btn_primary DeleteDetermine">确定</a>
            </div>
        </div>
    </div>

    <div class="js_dialog" id="iosDialog2" style="display: none;">
        <div class="weui-mask"></div>
        <div class="weui-dialog">
            <div class="weui-dialog__bd" id="DialogMessage"></div>
            <div class="weui-dialog__ft">
                <a href="javascript:;" class="weui-dialog__btn weui-dialog__btn_primary DeleteDefault">确定</a>
            </div>
        </div>
    </div>
</div>
<!------弹层处理------><!------弹层处理------>

<script type="text/javascript">
    //-----无删除弹层-------
    var $iosNdActionsheet = $('#iosNdActionsheet');//无删除弹层
    var $iosNdMask = $('#iosNdMask');
    function hideNdActionSheet() {
        $iosNdActionsheet.removeClass('weui-actionsheet_toggle');
        $iosNdMask.fadeOut(200);
    }
    $iosNdMask.on('click', hideNdActionSheet);
    $('#iosNdActionsheetCancel').on('click', hideNdActionSheet);

    $(".cashiersDiv").on("click", function(){
        var codeName = $(this).attr("codeName");
        var mobilephone = $(this).attr("mobilephone");

            $iosNdActionsheet.addClass('weui-actionsheet_toggle');
            $iosNdMask.fadeIn(200);
            $("#codeNameNd").val(codeName);
            $("#mobilephoneNd").val(mobilephone);
    });

    //删除
    $(".colorDanger").on("click", function(){
        var codeNameNd = $("#codeNameNd").val();
        var mobilephoneNd = $("#mobilephoneNd").val();
        hideNdActionSheet();

        $("#codeNameVal").html(codeNameNd);
        $("#mobilephone").val(mobilephoneNd);
        $iosDialog1.fadeIn(200);
    });
    //-------确定+取消弹层------
    var $iosDialog1 = $('#iosDialog1');
    var $iosDialog2 = $('#iosDialog2')

    $('#dialogs').on('click', '.DeleteDefault', function(){ //取消按钮事件
        $(this).parents('.js_dialog').fadeOut(200);
    });
    $('#dialogs').on('click', '.DeleteDetermine', function(){ //确定按钮事件
        var mobilephone = $("#mobilephone").val();
        $.ajax({
            type: "POST",
            url: "../auth/delCashier",
            data: {mobilephone: mobilephone},
            dataType: "json",
            success: function (result) {
                if (result.code == 0) {
                    location.href = "../auth/viewCashierList";
                }else{
                    $(this).parents('.js_dialog').fadeOut(200);
                    $("#DialogMessage").html(result.msg);
                    $iosDialog2.fadeIn(200);
                }
            }
        });
    });
</script>
</body>
</html>